import "./_style.scss";
import { Menu, Layout } from "antd";
import { HomeOutlined, UserOutlined } from "@ant-design/icons";
import { Link } from "react-router-dom";
import HomeRouter from "../../Router/HomeRouter";
import { useSelector } from "react-redux";
const {Header, Footer, Content} = Layout;
const Home = () => {
  const loginInfo = useSelector(state => state.user.loginInfo)
  const notLogged = () => {
    if (loginInfo) {
      return;
    }else {
      return (
        <div className="not_logged">
          <Link to="/login">
            登录
          </Link>
          <Link to="/logon">
            注册
          </Link>
        </div>
      )
    }
  };
  return (
    <Layout className="home">
      <Header className="bginit header">
        {notLogged()}
        <Menu defaultOpenKeys="home" mode="horizontal" className="bginit menu">
          <Menu.Item>
            <Link to="/home">
              <HomeOutlined className="home-icon" />首页
            </Link>
          </Menu.Item>
          <Menu.Item>
            <Link to="/home/list">
              看文章
            </Link>
          </Menu.Item>
          <Menu.Item>
            <Link to="/home/edit">
              写文章
            </Link>
          </Menu.Item>
          <Menu.Item className="user-entry">
            <Link to="/user">
              <UserOutlined className="home-icon" />
            </Link>
          </Menu.Item>
        </Menu>
      </Header>
      <Content className="container">
        <HomeRouter></HomeRouter>
      </Content>
      <Footer className="bginit">

      </Footer>
    </Layout>
  );
}

export default Home;
